Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

gradio web ui #2627

Closed
wants to merge 23 commits into from
Closed

gradio web ui #2627

wants to merge 23 commits into from

Conversation

AK391
Copy link

@AK391 AK391 commented Mar 28, 2021

created a easy to use web ui with gradio

πŸ› οΈ PR Summary

Made with ❀️ by Ultralytics Actions

🌟 Summary

Added Gradio Web Demo functionality for YOLOv5 object detection.

πŸ“Š Key Changes

  • Gradio library added to requirements.txt to enable web-based demos.
  • New file utils/gradio/demo.py containing code to set up a web interface using Gradio:
    • Two example images from the YOLOv5 repository are preloaded.
    • The YOLOv5s model is loaded from PyTorch hub for inference.
    • A function for running the model on the input image and rendering the output.
    • Gradio Interface setup includes descriptions, titles, and example images to guide users.

🎯 Purpose & Impact

  • 🎨 Allows users to easily test YOLOv5's object detection capabilities through a web interface without needing coding skills or installation.
  • πŸš€ Provides immediate accessibility for demonstrations, enhancing the understanding and usability of the YOLOv5 model for both experts and non-experts alike.
  • 🌐 Opens up opportunities for broader community engagement and feedback, potentially leading to further improvements in the model.

Copy link
Contributor

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

πŸ‘‹ Hello @AK391, thank you for submitting a πŸš€ PR! To allow your work to be integrated as seamlessly as possible, we advise you to:

  • βœ… Verify your PR is up-to-date with origin/master. If your PR is behind origin/master an automatic GitHub actions rebase may be attempted by including the /rebase command in a comment body, or by running the following code, replacing 'feature' with the name of your local branch:
git remote add upstream https://github.com/ultralytics/yolov5.git
git fetch upstream
git checkout feature  # <----- replace 'feature' with local branch name
git rebase upstream/master
git push -u origin -f
  • βœ… Verify all Continuous Integration (CI) checks are passing.
  • βœ… Reduce changes to the absolute minimum required for your bug fix or feature addition. "It is not daily increase but daily decrease, hack away the unessential. The closer to the source, the less wastage there is." -Bruce Lee

@glenn-jocher
Copy link
Member

@AK391 thanks for the PR! Really interesting, you can create a Gradio demo in very few lines of code it seems.

It looks like you've tried to increase the line thickness for larger images, maybe we can take a look at that plotting aspect. It's hard to create a one-size-fits all plotting routine because often times very large images may have many small objects that thinner lines are better suited to.

Also note that we don't want to add additional images directly to the repository, as this will increase the git clone package size for all users. Rather than adding content to the repo, you can host it directly on GitHub (by uploading it into an issue message), and then use the URL that github assigns the uploaded content. We do this ourselves for all README content, etc.

@glenn-jocher
Copy link
Member

@AK391 also another question, can we place demo.py in either utils/gradio_demo.py or utils/gradio/demo.py?

PEP8, remove unused results.img line (has no effect), and updated article and description.
@glenn-jocher
Copy link
Member

@AK391 I updated demo.py a bit, and was wondering about your yolo() function. If the input is already a pil image, then there should be no need to save the image to disk and then read it from disk. If my understanding is correct then we should be able to reduce yolo() from:

def yolo(img):
    img.save("test_image_hack.png")
    img = Image.open("test_image_hack.png")
    results = model(img)  # inference
    os.remove("test_image_hack.png")

    results.render()  # updates results.imgs with boxes and labels
    for img in results.imgs:
        return Image.fromarray(img)

to:

def yolo(img):
    results = model(img)  # inference
    results.render()  # updates results.imgs with boxes and labels
    for img in results.imgs:
        return Image.fromarray(img)

Even after this simplification though I disagree with the return function within a for loop, as this would only ever return the first element, so assuming only 1 image is every passed at a time by the gradio app, this should be further reduced to:

def yolo(img):
    results = model(img)  # inference
    results.render()  # updates results.imgs with boxes and labels
    return Image.fromarray(results.imgs[0])  # return annotated PIL Image

@AK391
Copy link
Author

AK391 commented Mar 28, 2021

@glenn-jocher thanks, I agree with the changes except the yolo function changes breaks the app
currently getting
Screen Shot 2021-03-28 at 11 48 47 AM

I think saving it to disk was a way around that I tried

@AK391
Copy link
Author

AK391 commented Mar 28, 2021

@glenn-jocher Also the label is too small to read is there a way to increase the font size?

@glenn-jocher
Copy link
Member

glenn-jocher commented Mar 28, 2021

@glenn-jocher thanks, I agree with the changes except the yolo function changes breaks the app
currently getting
Screen Shot 2021-03-28 at 11 48 47 AM

I think saving it to disk was a way around that I tried

I believe the 'Image' object has no filename message is due to out of date YOLOv5 PyTorch Hub code that was fixed a few weeks ago. You can update your Hub cache like this to ensure you are using the latest code:

YOLOv5 PyTorch Hub Tutorial

Force Reload

If you run into problems with the above steps, setting force_reload=True may help by discarding the existing cache and force a fresh download of the latest YOLOv5 version from PyTorch Hub.

model = torch.hub.load('ultralytics/yolov5', 'yolov5s', force_reload=True)  # force reload

The labels themselves are actually the same size typically, it's your image that is larger. If you run inference on smaller images, i.e. 640 or 1280 pixels your labels will appear better sized.

glenn-jocher and others added 2 commits March 28, 2021 20:18
pretrained=True is True by default, so replaced with force_reload=True to ensure latest version of YOLOv5 code is cached when run.
@AK391
Copy link
Author

AK391 commented Mar 28, 2021

@glenn-jocher thanks, made some changes for formatting and resizing the image to make the label more readable, I will also add the images here to use a url thanks for suggestion and remove from repo
dominik-lange-BFsm5vldl2I-unsplash
ray-hennessy-xUUZcpQlqpM-unsplash

@AK391
Copy link
Author

AK391 commented Mar 28, 2021

@glenn-jocher added urls and removed button, should be good to merge? I will refresh app to test

@glenn-jocher
Copy link
Member

glenn-jocher commented Mar 28, 2021

@AK391 I can't merge additional media into yolov5 master. You have the two very large images directly in the main yolov5/ directory, as well as demo.py.

Please place demo.py in a new yolov5/utils/gradio/ directory, and delete bird.jpg and fox.jpg now that they are hosted online.

@AK391
Copy link
Author

AK391 commented Mar 28, 2021

@glenn-jocher moved file and deleted images, also relauched however I tried both the hosted url from github and imgur and it breaks the links in the app

@AK391
Copy link
Author

AK391 commented Mar 28, 2021

@glenn-jocher see screenshot
Screen Shot 2021-03-28 at 5 32 32 PM

@AK391
Copy link
Author

AK391 commented Mar 28, 2021

@glenn-jocher should be good to merge now example images are showing now with a workaround

@AK391
Copy link
Author

AK391 commented Mar 29, 2021

@glenn-jocher is it ok to save the images in demo.py, should not be in repo unless demo.py is run

@glenn-jocher
Copy link
Member

glenn-jocher commented Mar 29, 2021

@AK391 I think for best demo performance you'd want to reduce your steps to the minimum viable steps, so saving an image and then loading it again right after is not good practice.

If there is a problem with inputting PIL Images or filenames directly then we should open up a bug report and fix it. Can you provide a minimum reproducible example of what is going wrong to help us better understand and diagnose your problem? Thank you!

@AK391
Copy link
Author

AK391 commented Mar 29, 2021

@glenn-jocher do you mean for the hack to get around loading a file during inference or for loading example images?

@robmarkcole
Copy link
Contributor

robmarkcole commented Apr 8, 2021

@AK391 the hack should not be necessary now if due to #2702

I understand your reasoning for wishing to put the images in the repo, since it simplifies the example. There are already a couple of example images at https://github.com/ultralytics/yolov5/tree/master/data/images that could be used

I would also suggest adding a new readme in this PR to briefly explain what gradio is and for

Removed unused import os, removed unused return in for loop, updated resize from width to any axis, removed force_reload which will be very time consuming if run every time demo.py runs.
@glenn-jocher
Copy link
Member

@AK391 I've updated demo.py with all changes I would recommend. Saving and loading should no longer be required as noted by @robmarkcole, and I've updated the images from parrots and foxes (COCO classes do not contain foxes) to the default YOLOv5 images.

I've also removed force_reload=True. This is meant to update your cache when it is out of date, but will be very very slow if run every time demo.py is run.
Please test these updates on your end.

@AK391
Copy link
Author

AK391 commented Apr 13, 2021

@glenn-jocher thanks for the changes there was a error when syncing with the live app
Traceback (most recent call last):
File "utils/gradio/demo.py", line 1, in
import gradio as gr
ModuleNotFoundError: No module named 'gradio'
before gradio did not need to be installed in requirements.txt when I first ported it but since then it does need to be added to requirements.txt file
other than that looks good and thanks @robmarkcole for the suggestions

@AK391
Copy link
Author

AK391 commented May 7, 2021

@glenn-jocher any update on this?

@SkalskiP SkalskiP changed the base branch from master to develop May 24, 2021 20:10
@glenn-jocher glenn-jocher deleted the branch ultralytics:develop June 8, 2021 08:22
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants